import React from 'react';
import BaseLayout from './BaseLayout';

import { LocaleProvider, ConfigProvider, Empty } from 'antd';

import zh_CN from 'antd/lib/locale-provider/zh_CN';
// import zhCN from 'antd/es/locale/zh_CN.js';
import empty from '@/assets/images/empty.png';

import moment from 'moment';
import 'moment/locale/zh-cn';

moment.locale('zh-cn')

export interface Props {
  location: any,
  dispatch?: Function,
  children?: React.ReactNode,
}

class BasicLayout extends React.Component<Props, any> {

  componentDidMount() {
    const token = sessionStorage.getItem('token');
    const route = this.props.location.pathname;
    if (route !== '/users/login' && (!token || token.length === 0)) {
      window.location.href = '/users/login'
    }
  }

  componentDidUpdate(prevProps) {
    if (this.props.location !== prevProps.location) {
      window.scrollTo(0, 0);
    }
  }

  customizeRenderEmpty = () => (
    <div style={{ textAlign: 'center' }}>
      <Empty
        image={empty}
        description={
          <span style={{ color: 'rgba(0, 0, 0, 0.75)' }}>暂无数据</span>
        }
      >
      </Empty>
    </div>
  );

  render() {
    const { location, children } = this.props;
    return (
      <LocaleProvider locale={zh_CN} >
        <ConfigProvider renderEmpty={this.customizeRenderEmpty}>
        {(location.pathname === '/users/login' || location.pathname === '/' || location.pathname === '') ? (
          <>{children}</>
        ) : (
            <BaseLayout {...this.props} />
          )}
      </ConfigProvider >
      </LocaleProvider>
    );
  }
}

export default BasicLayout;
